<template>
  <div class="weui-panel full" style="background: #fff">
    <div class="weui-tab">
      <div class="weui-tab__bd">
        <div class="weui-tab__bd-item weui-tab__bd-item--active" ref="list">
          <div class="weui-cell weui-flex list-title">
            <div class="weui-flex__item" v-for="(t, index) in listTitle" :key="index">{{t}}</div>
          </div>

          <div class="weui-cell weui-flex" v-for="(source, index) in listData" :key="index">
            <div class="weui-flex__item">
              <img class="list-user-img" :src="source.headurl" alt="">
            </div>
            <div class="weui-flex__item">
              <p class="info-grey">{{source.realname}}</p> 
              <p>{{source.nickname}}</p>
            </div>
            <div class="weui-flex__item">
              <p>{{source.lftid}}</p>
            </div>
            <div class="weui-flex__item">
              <span v-show="source.status === 1"><i class="weui-icon-success-no-circle"></i>已通过</span>
              <span v-show="source.status === 2"><i class="weui-icon-cancel"></i>已拒绝</span>
              <div class="button_sp_area" v-show="source.status === 0">
                <a class="weui-btn btn_mini weui-btn_primary" @click="doAudit(source, 1)">通过</a>
                <a class="weui-btn btn_mini weui-btn_default" @click="doAudit(source, 2)">拒绝</a>
              </div>
            </div>
               
          </div>

          <div class="no-data" v-show="!listData.length && !loading">暂无数据</div>

          <div class="weui-loadmore" v-show="loading">
            <i class="weui-loading"></i>
            <span class="weui-loadmore__tips">正在加载</span>
          </div>

        </div>
      </div>
    </div>
  </div>
</template>

<script>
// import WeuiListTab from '../components/WeuiListTab'
// import WeuiNavBar from '../components/WeuiNavBar'
import { mapState } from 'Vuex'
export default {
  data() {
    return {
      listTitle: ['头像', '姓名/昵称', 'ID', '操作'],
      listData: [],
      loading: false,
      offset: 0,
      limit: 50,
      noMore: false,
      recordType: 1
    }
  },
  mounted() {
    // this.fakeData()
    this.query()
    this.initInfinite()
  },
  methods: {
    fakeData() {
      this.listData = [{nickname: '3'}, {nickname: '3'}, {nickname: '3'}, {nickname: '3'}, {nickname: '3'}, {nickname: '3'}, {nickname: '3'}, {nickname: '3'}, {nickname: '3'}, {nickname: '3'}]
    },
    initInfinite() {
      const listHeight = document.body.offsetHeight + 'px'
      Object.assign(this.$refs.list.style, { height: listHeight, 'overflow-y': 'auto' })
      $(this.$refs.list).infinite().on('infinite', () => {
        if (this.loading) {
          return
        }
        this.offset += this.limit
        this.query()
      });
    },
    query() {
      const send = {
        areaCode: this.areaCode,
        token: this.token,
        applyuid: null,
        status: null,
        offset: this.offset,
        limit: this.limit
      }
      console.log(send)
      this.loading = true
      this.api.agentAudit.getList(send).then(res => res.json()).then(data => {
        console.log('agentAudit', data)
        this.loading = false
        if (data.errorCode) {
          $(this.$refs.list).destroyInfinite()
          return
        }
        this.noMore = data.source.length === 0
        if (this.noMore) {
          $(this.$refs.list).destroyInfinite()
        }
        this.listData = this.listData.concat(data.source)
        console.log('this.listData', this.listData);
      })
    },
    doAudit(source, type) {
      const msg = type === 1 ? `确定通过用户 ${source.realname} 的请求?` : `确定拒绝用户 ${source.realname} 的请求?`
      $.confirm(msg, () => {
        window.btn_sound.play();
        const send = {
          areaCode: this.areaCode,
          token: this.token,
          applyuid: source.lftid,
          status: type
        }
        console.log(send)
        this.loading = true
        this.api.agentAudit.doAudit(send).then(res => res.json()).then(data => {
          console.log(data)
          this.loading = false
          if (data.errorCode) {
            $.alert(data.message);
            return
          }
          if (type === 1) {
            $.alert(`已通过用户 ${source.realname} 的请求`);
          } else {
            $.alert(`已拒绝用户 ${source.realname} 的请求`);
          }
          source.status = type
        })
      });
      window.btn_sound.play();
    }
  },
  computed: {
    ...mapState(['api', 'token', 'areaCode', 'user'])
  },
  components: {
  }
}

</script>

<style lang="less">

</style>